// 图片缩小
.box2  {
    margin: 20px auto;
    width: 400px;
    img{
        width: 100%;
        transition: all 0.5s;
    }   
   &:hover img{
        // width: 200px;
        // 倍数
        transform: scale(0.6);
    }
}



// 渐变
.box3{
    width: 400px;
    height: 400px;
    margin: 0 auto;
    background-color: green;
    // 线性渐变
    background-image: linear-gradient(
        to top,
        red,
        green
    );
    background-image: linear-gradient(
        45deg,
        red,
        green
    );
    background-image: linear-gradient(
        #fff 10%,
        #000
    );
}
.boxcommon{
    width: 400px;
    height: 400px;
    margin: 0 auto;
    background-color: green;
    
}
// 经向渐变
.box4{
    border-radius: 50%;
    background-image: radial-gradient(
        100px at center center,
        red ,
        #000
        );
}